<!DOCTYPE html>
<html>    
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Access-Control-Allow-Origin" content="*">
		<meta http-equiv="content-security-policy">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">        
        <title>
            哇吖·城市探秘
        </title>
        <!-- Path to Framework7 Library CSS-->
        <link rel="stylesheet" href="/css/framework7.ios.min.css">
        <link rel="stylesheet" href="/css/framework7.ios.colors.min.css">
        <!-- Path to your custom app styles-->
        <link rel="stylesheet" href="/css/my-app.css">
    </head>
    <body style="-webkit-text-size-adjust:none;">
    <!-- Status bar overlay for full screen mode (PhoneGap) -->
    <div class="statusbar-overlay"></div>
    <!-- Views -->
    <div class="views">
      <!-- Your main view, should have "view-main" class -->
      <div class="view view-main">
        <!-- Top Navbar-->
        <div class="navbar" style="z-index:-99;">
          <div class="navbar-inner">
          </div>
        </div>
        <!-- Pages container, because we use fixed-through navbar and toolbar, it has additional appropriate classes-->
        <div class="pages navbar-through">
          <!-- Page, "data-page" contains page name -->
          <div data-page="zy_case_index" class="page no-navbar" id="zy_case_index">
            <!-- Scrollable page content -->
            <div class="page-content">
		       
            </div>
          </div>
        </div>
      </div>
    </div>
    
	<script id="ziying_case_index" type="text/template">
     <div class="swiper-container swiper-ziying-case-index">
     	<div class="swiper-pagination swiper-pagination-ziying-case-index"></div>
    	<div class="swiper-wrapper">
      		{{#each covers}}
	            <div class="swiper-slide imgslide" style="background-image:url('{{this}}')"></div>
	        {{/each}}
    	</div>
  	 </div>
	</script>
    
    <!-- Path to Framework7 Library JS-->
    <script type="text/javascript" src="/js/framework7.js"></script>
    <!-- 全局函数和变量 -->
    <script type="text/javascript">
	    //初始化app
	    var myApp = new Framework7({
		    modalTitle: '哇吖旅行',
		    modalButtonOk: '知道了',
		    animateNavBackIcon: false,
		    precompileTemplates: true,
		    template7Pages: true,
	    });
	    
	    //初始化view 
	    var mainView = myApp.addView('.view-main', {
	    	  dynamicNavbar: true
	    });
	    
	    // Export selectors engine
	    var $$ = Dom7;
	    var url_get_ziying_case_index="http://api.wayatrip.com/ziying/zycaseIndex";
	    
	    //预编译模板
	    myApp.zycaseindexTemplate = Template7.compile($$('script#ziying_case_index').html());
	    
	    /* zycase index */
	     $$.ajax({
	          url:url_get_ziying_case_index,
	          method:"GET",
	          async:false,
	          data:{},
	          dataType:'json',
	          success: function (ajaxresult) {
	        	  console.log(ajaxresult);
	        	  if(ajaxresult.code==1){
	        		  var data_zy_case_index = ajaxresult.data;
	        		  var html_zy_case_index = myApp.zycaseindexTemplate(data_zy_case_index);
	        		  console.log(html_zy_case_index);
	        		  $$('#zy_case_index .page-content').html(html_zy_case_index);
	        		  //图片滚动
	                  var zycaseindexswiper = new Swiper('.swiper-ziying-case-index', {
	              	  		pagination:".swiper-pagination-ziying-case-index",
	              	  		loop:true,
	              	  		direction:'vertical',
	                  });
	        		  
	        	  }else{
	        		  myApp.alert(ajaxresult.msg);
	        	  }
	          }
          });
          
	    
	    
    </script>
   </body>
</html>